"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.PopupWebLayout = PopupWebLayout;

var _react = _interopRequireDefault(require("react"));

var _reactDom = _interopRequireDefault(require("react-dom"));

var _icon = _interopRequireDefault(require("../../icon"));

var _button = _interopRequireDefault(require("../../button"));

var _classnames = _interopRequireDefault(require("classnames"));

var _configContext = require("../../../extends/configContext");

var _noop = require("../../../utils/noop");

var _excluded = ["position", "visible", "onClose", "onCancel", "onSubmit", "maskClosable", "children", "className", "containerClassName", "withCloseIcon", "popupContainer", "withFooter"];

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

// 以下代码为 IE11 提供兼容性支持

/* ! https://mths.be/scrollingelement v1.5.2 by @diegoperini & @mathias | MIT license */
if (typeof document !== 'undefined') {
  if (!('scrollingElement' in document)) (function () {
    function computeStyle(element) {
      if (window.getComputedStyle) {
        // Support Firefox < 4 which throws on a single parameter.
        return getComputedStyle(element, null);
      } // Support Internet Explorer < 9


      return element.currentStyle;
    }

    function isBodyElement(element) {
      // The `instanceof` check gives the correct result for e.g. `body` in a
      // non-HTML namespace.
      if (window.HTMLBodyElement) {
        return element instanceof HTMLBodyElement;
      } // Fall back to a `tagName` check for old browsers.


      return /body/i.test(element.tagName);
    }

    function getNextBodyElement(frameset) {
      // We use this function to be correct per spec in case `document.body` is
      // a `frameset` but there exists a later `body`. Since `document.body` is
      // a `frameset`, we know the root is an `html`, and there was no `body`
      // before the `frameset`, so we just need to look at siblings after the
      // `frameset`.
      var current = frameset;

      while (current = current.nextSibling) {
        if (current.nodeType == 1 && isBodyElement(current)) {
          return current;
        }
      } // No `body` found.


      return null;
    } // Note: standards mode / quirks mode can be toggled at runtime via
    // `document.write`.


    var isCompliantCached;

    var isCompliant = function isCompliant() {
      var isStandardsMode = /^CSS1/.test(document.compatMode);

      if (!isStandardsMode) {
        // In quirks mode, the result is equivalent to the non-compliant
        // standards mode behavior.
        return false;
      }

      if (isCompliantCached === void 0) {
        // When called for the first time, check whether the browser is
        // standard-compliant, and cache the result.
        var iframe = document.createElement('iframe');
        iframe.style.height = '1px';
        (document.body || document.documentElement || document).appendChild(iframe);
        var doc = iframe.contentWindow.document;
        doc.write('<!DOCTYPE html><div style="height:9999em">x</div>');
        doc.close();
        isCompliantCached = doc.documentElement.scrollHeight > doc.body.scrollHeight;
        iframe.parentNode.removeChild(iframe);
      }

      return isCompliantCached;
    };

    function isRendered(style) {
      return style.display != 'none' && !(style.visibility == 'collapse' && /^table-(.+-group|row|column)$/.test(style.display));
    }

    function isScrollable(body) {
      // A `body` element is scrollable if `body` and `html` both have
      // non-`visible` overflow and are both being rendered.
      var bodyStyle = computeStyle(body);
      var htmlStyle = computeStyle(document.documentElement);
      return bodyStyle.overflow != 'visible' && htmlStyle.overflow != 'visible' && isRendered(bodyStyle) && isRendered(htmlStyle);
    }

    var scrollingElement = function scrollingElement() {
      if (isCompliant()) {
        return document.documentElement;
      }

      var _document = document,
          body = _document.body; // Note: `document.body` could be a `frameset` element, or `null`.
      // `tagName` is uppercase in HTML, but lowercase in XML.

      var isFrameset = body && !/body/i.test(body.tagName);
      body = isFrameset ? getNextBodyElement(body) : body; // If `body` is itself scrollable, it is not the `scrollingElement`.

      return body && isScrollable(body) ? null : body;
    };

    if (Object.defineProperty) {
      // Support modern browsers that lack a native implementation.
      Object.defineProperty(document, 'scrollingElement', {
        get: scrollingElement
      });
    } else if (document.__defineGetter__) {
      // Support Firefox ≤ 3.6.9, Safari ≤ 4.1.3.
      document.__defineGetter__('scrollingElement', scrollingElement);
    } else {
      // IE ≤ 4 lacks `attachEvent`, so it only gets this one assignment. IE ≤ 7
      // gets it too, but the value is updated later (see `propertychange`).
      document.scrollingElement = scrollingElement();
      document.attachEvent && document.attachEvent('onpropertychange', function () {
        // This is for IE ≤ 7 only.
        // A `propertychange` event fires when `<body>` is parsed because
        // `document.activeElement` then changes.
        if (window.event.propertyName == 'activeElement') {
          document.scrollingElement = scrollingElement();
        }
      });
    }
  })();
}
/**
  * ModalHelper helpers resolve the modal scrolling issue on mobile devices
  * https://github.com/twbs/bootstrap/issues/15852
  * requires document.scrollingElement polyfill https://github.com/yangg/scrolling-element
  */


var ModalHelper = function (bodyCls) {
  var scrollTop;
  return {
    afterOpen: function afterOpen() {
      scrollTop = document.scrollingElement.scrollTop;
      document.body.classList.add(bodyCls);
      document.body.style.top = "".concat(-scrollTop, "px");
    },
    beforeClose: function beforeClose() {
      document.body.classList.remove(bodyCls); // scrollTop lost after set position:fixed, restore it back.

      if (scrollTop) {
        document.scrollingElement.scrollTop = scrollTop;
      }
    }
  };
}('modal-open');

function PopupWebLayout(_ref) {
  var position = _ref.position,
      visible = _ref.visible,
      onClose = _ref.onClose,
      _ref$onCancel = _ref.onCancel,
      onCancel = _ref$onCancel === void 0 ? _noop.noop : _ref$onCancel,
      _ref$onSubmit = _ref.onSubmit,
      onSubmit = _ref$onSubmit === void 0 ? _noop.noop : _ref$onSubmit,
      maskClosable = _ref.maskClosable,
      children = _ref.children,
      className = _ref.className,
      containerClassName = _ref.containerClassName,
      withCloseIcon = _ref.withCloseIcon,
      popupContainer = _ref.popupContainer,
      withFooter = _ref.withFooter,
      props = _objectWithoutProperties(_ref, _excluded);

  var _useConfig = (0, _configContext.useConfig)(),
      clsPrefix = _useConfig.clsPrefix;

  _react.default.useEffect(function () {
    if (visible) {
      ModalHelper.afterOpen();
    } else {
      ModalHelper.beforeClose();
    }
  }, [visible]);

  var popupElement = /*#__PURE__*/_react.default.createElement("div", _extends({
    className: (0, _classnames.default)("".concat(clsPrefix, "-popup"), className)
  }, props), /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)("".concat(clsPrefix, "-popup__overlay"), {
      'is-shown': visible
    }),
    onClick: function onClick() {
      if (maskClosable) {
        onClose();
      }
    }
  }), /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)("".concat(clsPrefix, "-popup__container"), containerClassName, position, {
      'is-shown': visible,
      'is-expanded': visible
    })
  }, withCloseIcon && /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)("".concat(clsPrefix, "-popup__close-icon")),
    onClick: function onClick() {
      onClose();
    }
  }, /*#__PURE__*/_react.default.createElement(_icon.default, {
    name: 'CloseOutlined'
  })), children, withFooter && /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)("".concat(clsPrefix, "-popup__footer"))
  }, /*#__PURE__*/_react.default.createElement(_button.default, {
    className: (0, _classnames.default)("".concat(clsPrefix, "-popup__btn")),
    type: "info",
    onClick: function onClick() {
      onClose();
      onCancel();
    }
  }, "\u53D6\u6D88"), /*#__PURE__*/_react.default.createElement(_button.default, {
    className: (0, _classnames.default)("".concat(clsPrefix, "-popup__btn")),
    type: "primary",
    onClick: function onClick() {
      onSubmit();
    }
  }, "\u786E\u8BA4"))));

  if (typeof window === 'undefined') {
    return popupElement;
  }

  return /*#__PURE__*/_reactDom.default.createPortal(popupElement, popupContainer || document.getElementsByTagName('body')[0]);
}